/**********************B端样式表***********2017-9-28******************/
html{
  font-size: 100px;     /*子元素rem计算便利*/
}
body
{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; 
    background-color: #f5f5f5;
    font-family:"Microsoft YaHei",tahoma,arial,"Hiragino Sans GB",\\5b8b\4f53,sans-serif;
    color: #5b5b5b;
    /*min-width: 989px;*/
    -ms-overflow-style:scrollbar;
}


.w-100 {width: 100%; margin: 0; padding: 0;}

/*清除bootstrap默认样式*/
ol,ul,li,dl,dt,dd { list-style-type: none; margin: 0; padding: 0; font-weight:normal;}
h1,h2,h3,h4,h5,h6{ margin: 0; padding: 0; line-height:inherit;}
input,button,select,textarea{ outline: none;}

/*重置container在bootstrap内边距左右15px为0*/
.container {
  padding-right: 0;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}

/*滚动条样式*/
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-button{height:0;width:0}
::-webkit-scrollbar-track{background-color:#f2f2f2;}
::-webkit-scrollbar-thumb{background:#00b8d4;}

/*重置a在bootstrap中颜色和鼠标滑过颜色变化*/
a {
  color: #5B5B5B;
  text-decoration: none;
  outline: none;
}
a:hover,
a:focus {
  color: #ff4081;
  text-decoration: none;
  outline: none;
}

a.a-999{
  color: #999;
  text-decoration: none;
}
a.a-999:hover,
a.a-999:focus {
  color: #ff4081;
  text-decoration: none;
}

a.a-green{
  color: #00b8d4;
  text-decoration: none;
}
a.a-green:hover,
a.a-green:focus {
  color: #ff4081;
  text-decoration: none;
}

a.a-white:hover,
a.a-white:focus {
  color: #fff;
  text-decoration: none;
}
/*bootstrap中dialog居中显示*/
.modal-dialog {
  position: relative;
  top:150px;
}

/*自定义字体图标样式基类*/
.iconfont{ font-size: inherit;}

/*公有颜色*/
.color-main{color: #ff4081;}
.color-sec{ color: #00b8d4;}
.color-999{ color: #999;}
.color-666{ color: #666;}
.color-333{ color: #333;}
.color-white{color: #fff;}
.color-yellow{ color: #ffec49;}

.bg-main{background-color: #ff4081;}
.bg-sec{ background-color: #00b8d4;}
.bg-999{ background-color: #999;}
.bg-666{ background-color: #666;}
.bg-333{ background-color: #333;}
.bg-f5{ background-color: #f5f5f5;}
.bg-f2{ background-color: #f2f2f2;}
.bg-white{background-color: #fff;}

/*共有按钮*/
.btn{outline: none !important;}
.btn-default {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}
.btn-default:focus,
.btn-default.focus {
  color: #333;
  background-color: #f2f2f2;
  border-color: #ededed;
}
.btn-default:hover {
  color: #333;
  background-color: #f2f2f2;
  border-color: #ededed;
}
.btn-default:active:hover,
.btn-default.active:hover,
.open > .dropdown-toggle.btn-default:hover,
.btn-default:active:focus,
.btn-default.active:focus,
.open > .dropdown-toggle.btn-default:focus,
.btn-default:active.focus,
.btn-default.active.focus,
.open > .dropdown-toggle.btn-default.focus {
  color: #333;
  background-color: #f2f2f2;
  border-color: #ededed;
}

.btn-mian {
  color: #fff;
  background-color: #ff4081;
  border-color: #ff4081;
}
.btn-mian:focus,
.btn-mian.focus {
  color: #fff;
  background-color: #f1286c;
  border-color: #ff4081;
}
.btn-mian:hover {
  color: #fff;
  background-color: #f1286c;
  border-color: #ff4081;
}
.btn-mian:active:hover,
.btn-mian.active:hover,
.open > .dropdown-toggle.btn-mian:hover,
.btn-mian:active:focus,
.btn-mian.active:focus,
.open > .dropdown-toggle.btn-mian:focus,
.btn-mian:active.focus,
.btn-mian.active.focus,
.open > .dropdown-toggle.btn-mian.focus {
  color: #fff;
  background-color: #f1286c;
  border-color: #ff4081;
}


.btn-sec {
  color: #fff;
  background-color: #00b8d4;
  border-color: #00b8d4;
}
.btn-sec:focus,
.btn-sec.focus {
  color: #fff;
  background-color: #00a9c3;
  border-color: #00b8d4;
}
.btn-sec:hover {
  color: #fff;
  background-color: #00a9c3;
  border-color: #00b8d4;
}
.btn-sec:active:hover,
.btn-sec.active:hover,
.open > .dropdown-toggle.btn-sec:hover,
.btn-sec:active:focus,
.btn-sec.active:focus,
.open > .dropdown-toggle.btn-sec:focus,
.btn-sec:active.focus,
.btn-sec.active.focus,
.open > .dropdown-toggle.btn-sec.focus {
  color: #fff;
  background-color: #00a9c3;
  border-color: #00b8d4;
}


/*公有类*/
.ellipsis { display: block; overflow: hidden !important; white-space: nowrap; text-overflow: ellipsis; }
.ellipsis2 { display: block; overflow: hidden !important; max-height: 3.2em; display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; }
.ellipsis3 { display: block; overflow: hidden !important; max-height: 4.6em; display: -webkit-box !important; -webkit-line-clamp: 3; -webkit-box-orient: vertical; text-overflow: ellipsis; }

.v-middle { 
  position: absolute; 
  top: 50%;   left:50%; 
  -webkit-transform: translate(-50%, -50%); 
  transform: translate(-50%, -50%); 
}
.c-middle { 
  position: absolute;
  left:50%; 
  -webkit-transform: translate(-50%, 0); 
  transform: translate(-50%, 0);
}
.h-middle { 
  position: absolute; 
  top: 50%; 
  -webkit-transform: translate(0%, -50%); 
  transform: translate(0%, -50%);  
}


/*字体公有类*/
.fs12 { font-size: 0.12rem !important; }
.fs14 { font-size: 0.14rem !important; }
.fs16 { font-size: 0.16rem !important; }
.fs18 { font-size: 0.18rem !important; }
.fs20 { font-size: 0.2rem !important; }
.fs22 { font-size: 0.22rem !important; }
.fs24 { font-size: 0.24rem !important; }
.fs26 { font-size: 0.26rem !important; }
.fs28 { font-size: 0.28rem !important; }
.fs30 { font-size: 0.3rem !important; }
.fs32 { font-size: 0.32rem !important; }
.fs34 { font-size: 0.34rem !important; }
.fs36 { font-size: 0.36rem !important; }
.fs38 { font-size: 0.38rem !important; }
.fs40 { font-size: 0.4rem !important; }

/*间距公有类*/
.m0 { margin: 0 !important; }
.mt5 { margin-top: 0.05rem !important; }
.mr5 { margin-right:0.05rem !important; }
.mb5 { margin-bottom:0.05rem !important; }
.ml5 { margin-left:0.05rem !important; }
.mt10 { margin-top: 0.1rem !important; }
.mr10 { margin-right:0.1rem !important; }
.mb10 { margin-bottom:0.1rem !important; }
.ml10 { margin-left:0.1rem !important; }
.mt15 { margin-top: 0.15rem !important; }
.mr15 { margin-right:0.15rem !important; }
.mb15 { margin-bottom:0.15rem !important; }
.ml15 { margin-left:0.15rem !important; }
.mt20 { margin-top: 0.2rem !important; }
.mr20 { margin-right:0.2rem !important; }
.mb20 { margin-bottom:0.2rem !important; }
.ml20 { margin-left:0.2rem !important; }
.mt30 { margin-top: 0.3rem !important; }
.mr30 { margin-right:0.3rem !important; }
.mb30 { margin-bottom:0.3rem !important; }
.ml30 { margin-left:0.3rem !important; }

.p0 { padding: 0 !important; }
.pt3 { padding-top: 0.03rem !important; }
.pr3 { padding-right: 0.03rem !important; }
.pb3 { padding-bottom: 0.03rem !important; }
.pl3 { padding-left: 0.03rem !important; }
.pt5 { padding-top: 0.05rem !important; }
.pr5 { padding-right: 0.05rem !important; }
.pb5 { padding-bottom: 0.05rem !important; }
.pl5 { padding-left: 0.05rem !important; }
.pt10 { padding-top: 0.1rem !important; }
.pr10 { padding-right: 0.1rem !important; }
.pb10 { padding-bottom: 0.1rem !important; }
.pl10 { padding-left: 0.1rem !important; }
.pt15 { padding-top: 0.15rem !important; }
.pr15 { padding-right: 0.15rem !important; }
.pb15 { padding-bottom: 0.15rem !important; }
.pl15 { padding-left: 0.15rem !important; }
.pt20 { padding-top: 0.2rem !important; }
.pr20 { padding-right: 0.2rem !important; }
.pb20 { padding-bottom: 0.2rem !important; }
.pl20 { padding-left: 0.2rem !important; }
.pt30 { padding-top: 0.3rem !important; }
.pr30 { padding-right: 0.3rem !important; }
.pb30 { padding-bottom: 0.3rem !important; }
.pl30 { padding-left: 0.3rem !important; }



/**向下三角，有动画**/
.arrowdiv,.arrowT,.arrowR,.arrowB,.arrowL{ position: relative; padding-right: 14px; cursor: pointer;}
.arrowdiv b{ position: absolute; display: inline-block; width: 0px; height: 0px; border:4px solid; border-color:#999 transparent transparent transparent; top:50%; right: 3px; -webkit-transform:translateY(0) rotate(0deg);transform:translateY(0) rotate(0deg); -webkit-transition: all 0.2s ease-in; transition: all 0.2s ease-in;}
.arrowdiv.active b,.arrowdiv:hover b{border-color:#999 transparent transparent transparent; -webkit-transform:translateY(-60%) rotate(180deg);transform:translateY(-60%) rotate(180deg);}
/*方向三角，没有动画*/
.arrowT b{position: absolute; display: inline-block; width: 0px; height: 0px; border:4px solid; border-color:transparent transparent #999 transparent; top:20%; right: 3px;} 
.arrowR b{position: absolute; display: inline-block; width: 0px; height: 0px; border:4px solid; border-color:transparent transparent transparent #999; top:30%; right: 1px;} 
.arrowB b{position: absolute; display: inline-block; width: 0px; height: 0px; border:4px solid; border-color:#999 transparent transparent transparent; top:50%; right: 3px;} 
.arrowL b{position: absolute; display: inline-block; width: 0px; height: 0px; border:4px solid; border-color:transparent #999 transparent transparent; top:30%; right: 5px;} 










